{% extends "campus_gen.html" %}
{% block jsblock1 %}
    <div id="map">
    </div>

    <script type="text/javascript">
    {{js}}
 
var campus = {
  init: function(dom, json) {
    var MAX = 5;
    
    var $ = function(id)
    {
      return document.getElementById(id);
    }

    dom = $(dom);

    var clone = function(obj) {
      var val = {};
      for (key in obj) {
        val[key] = obj[key];
      }
      return val;
    }
    
    var MAP_TYPE = [
    G_NORMAL_MAP,
    G_SATELLITE_MAP
    ];
    function createMap(dom, stockMap) {
      var title = "<h5>" + stockMap.title + "</h5>";
      var mapDom = "<div id=\"" + stockMap.id + "\" class=\"campusMap\" style=\"width:" + stockMap.width + "px;height:" + stockMap.height + "px;\"></div>";
      var div = document.createElement('div');
      div.className = "stockMap";
      div.id = "container" + stockMap.id;

      div.innerHTML = title + mapDom;
      dom.appendChild(div);
      var map = new GMap2($(stockMap.id));
      map.setMapType(MAP_TYPE[stockMap.mapType]);
      var latlng = new GLatLng(stockMap.lat, stockMap.lng);
      map.setCenter(latlng, stockMap.zoom);
      map.enableScrollWheelZoom();
      map.addControl(new GLargeMapControl());
      map.addControl(new GMapTypeControl());
    }
    json = eval(json);
    for(var i = 0; i < json.length; i++) {
      createMap(dom, json[i]);
    }
  }
};

window.onload = function() {
  campus.init(dom, json);
}
</script>
{% endblock %} 
